<!DOCTYPE html>
<html
        xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout" xmlns:th="http://www.thymeleaf.org"
        layout:decorate="~{base/layout}">
<div layout:fragment="content">
    <!--med_tittle_section-->
    <div class="med_tittle_section">
        <div class="med_img_overlay"></div>
        <div class="container">
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="med_tittle_cont_wrapper">
                        <div class="med_tittle_cont">
                            <ol class="breadcrumb">
                                <li><a th:href="@{/}">系统首页</a></li>
                                <li>注册</li>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- med_tittle_section End -->
    <!--service section start-->
    <div class="page-container">
        <div class="container">
            <div class="row med_toppadder50 med_bottompadder50">
                <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12 col-lg-offset-3 col-md-offset-3">
                    <form name="form-submit" id="form-submit" method="post" class="cy-form boxed">
                        <header>新用户注册</header>
                        <fieldset>
                            <section>
                                <label class="input">
                                    <i class="icon-append fa fa-user"></i>
                                    <input name="username" id="username" required type="text" placeholder="用户名">
                                    <b class="tooltip tooltip-bottom-right">请输入正确的用户名,可用于登录和找回密码(必选)</b>
                                </label>
                            </section>

                            <section>
                                <label class="input">
                                    <i class="icon-append fa fa-nickname"></i>
                                    <input name="nickname" id="nickname" required type="text" placeholder="真实姓名">
                                    <b class="tooltip tooltip-bottom-right">请输入真实姓名</b>
                                </label>
                            </section>

                            <section>
                                <label class="input">
                                    <i class="icon-append fa fa-lock"></i>
                                    <input name="password" id="password" required type="password" placeholder="密码">
                                    <b class="tooltip tooltip-bottom-right">建议使用字母加数字或符号组合(必选)</b>
                                </label>
                            </section>

                        </fieldset>


                        <footer>
                            <button type="reset" class="button button-secondary">重 置</button>
                            <button type="button" onclick="saveForm()" class="button">注 册</button>
                        </footer>
                    </form>
                </div>

            </div>
        </div>
    </div>
    <script th:inline="javascript">

        function saveForm() {
            var password = $("#password").val();
            var nickname = $("#nickname").val();
            var username = $("#username").val();

            // username正则表达式
            var usernameRegex = /^[\u4E00-\u9FA5A-Za-z0-9_]+$/;
            if (username.length === 0) {
                window.alert("用户名为空");
                return false;
            } else if (usernameRegex.test(username) === false) {
                window.alert("用户名不合法（用户名只能由中文、数字、英文和下划线组成）");
                return false;
            }
            //匹配汉字(真实姓名)
            var realnameRegex = /^[\u4e00-\u9fa5]{2,10}$/;
            if (nickname.length !== 0) {
                if (realnameRegex.test(nickname) === false) {
                    window.alert("真实姓名不合法");
                    return false;
                }
            }

            // password正则表达式
            var passwordRegex = /^\w{6,40}$/;
            if (password.length === 0) {
                window.alert("密码不能为空");
                return false;
            } else if (passwordRegex.test(password) === false) {
                window.alert("输入密码不合法（密码只能是6-40位由数字、英文和下划线组成的字符串）");
                return false;
            }
            $.ajax({
                url: '/platform/register',
                data: $("#form-submit").serialize(),
                type: 'post',
                dataType: 'json',
                success: function (result) {
                    console.log(result);
                    if (result.code == 200) {
                        window.location.href = "/platform/loginUI";
                    }else {
                        alert(result.message);
                    }
                }
            })
        }
    </script>
</div>

</html>
